<script setup lang="ts">
import { provide, onMounted } from 'vue'
import i18n from '@/lang/index';
import { useGlobalLoading } from '@/utils/loading'

const { loading, setLoading } = useGlobalLoading()

// 提供全局的 loading 控制
provide('globalLoading', {
  setLoading,
  loading
})

// 在组件挂载后移除初始加载动画
onMounted(() => {
  const initialLoader = document.querySelector('#initial-loader');
  if (initialLoader) {
    initialLoader.remove();
  }
});

const getPopupContainer = (el, dialogContext) => {
  if (dialogContext) {
    return dialogContext.getDialogWrap();
  } else {
    return document.body;
  }
}
</script>

<template>
  <!-- 加载界面 -->
  <Transition name="loading">
    <div v-if="loading" class="loader-wrapper">
      <span class="loader">
        <span class="loader-inner"></span>
      </span>
    </div>
  </Transition>
  <a-config-provider :getPopupContainer="getPopupContainer" :locale="i18n.global.locale">
    <router-view />
  </a-config-provider>
</template>
